<template>
  <div>
    <h3>品类管理--添加品类</h3>
    <el-form status-icon label-width="100px" class="demo-ruleForm">
      <el-form-item label="所属品类" prop="pass">
        <el-select v-model="add" placeholder="请选择一级品类">
          <el-option
            v-for="(item, index) in regionList1"
            :key="index"
            :label="item.name"
            :value="item.name"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="品类名称" prop="checkPass">
        <el-input type="text" v-model="categoryName" class="input_1"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="edit">提交</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { add_category, category } from "../request/http";
export default {
  data() {
    return {
      regionList1: [],
      input: "",
      categoryName: "",
      add: "",
    };
  },
  mounted() {
    this.cateList(); //调用一级菜单
  },
  methods: {
      //添加品类
    async edit() {
      const { data: res } = await add_category(` /category/add_category.do`, {
        parentId: 0,
        categoryName: this.categoryName,
      });
      this.$message({
        message: "添加品类成功",
        type: "success",
      });
      this.$router.push({ path: "/basis" });
      console.log(res);
    },

    //获取一级菜单
    async cateList() {
      const { data: res } = await category(`/category/get_category.do`);
      console.log(res);
      this.regionList1 = res.data;
    },
  },
};
</script>

<style lang="scss">
.input_1 {
  width: 300px;
}
</style>